<template>
    <h2>会员权益录入</h2>
    <table class="table table-bordered">
        <tr>
            <td>会员权益名称</td>
            <td>
                <input type="text" placeholder="请输入会员权益名称" v-model="Info.mr_Name">
            </td>
        </tr>
        <tr>
            <td>会员权益说明</td>
            <td>
                <textarea cols="20" rows="4" placeholder="请输入会员权益说明" v-model="Info.mr_Info"></textarea>
            </td>
        </tr>
        <tr>
            <td>是否自定义</td>
            <td>
                <input type="radio"  value="true" v-model="Info.mr_Iscustom">是
                <input type="radio"  value="false"  v-model="Info.mr_Iscustom">否
            </td>
        </tr>
        <tr>
            <td>规则类型</td>
            <td>
                <select  v-model="Info.mr_RuleType">
                    <option :value="-1">请选择</option>
                    <option :value="1">折扣</option>
                    <option :value="2">延时</option>
                    <option :value="3">餐饮</option>
                </select>
            </td>
        </tr>
        <tr>
            <td>会员权益规则</td>
            <td>
                <textarea cols="20" rows="4" placeholder="请输入会员权益规则"  v-model="Info.mr_Rule"></textarea>
            </td>
        </tr>
        <tr>
            <td colspan="2" style="text-align: center;">
                <input type="button" value="保存" @click="SaveData" class="btn btn-primary">
            </td>
            
        </tr>
    </table>
</template>

<script setup lang="ts">
import axios from 'axios';
import {ref} from 'vue'
import { useRouter } from 'vue-router';
//创建路由实例
const router=useRouter();
//声明响应式数据
const Info=ref({
    mr_Name: "",
    mr_Info: "",
    mr_Iscustom: true,
    mr_RuleType: -1,
    mr_Rule: ""
  })
//声明保存数据事件
const SaveData=()=>{
    //验证权益名称不能为空
    if(Info.value.mr_Name==""){
        alert("会员权益名称不能为空")
        return;
    }
   //验证权益名称必需为中文，中文最多输入10哥字符
    var reg =/[\u4e00-\u9fa5]/;
    if(!reg.test(Info.value.mr_Name)){
        alert("权益名称必需为中文")
        return
    }
    //验证权益说明描述内容必需大于五个字符
    if(Info.value.mr_Info.length<5){
        alert("请输入会员权益说明必需大于五个字符")
        return;
    }
    axios.post("https://localhost:44376/api/Member/Add",Info.value)
    .then(res=>{
        if(res.data>0){
            alert("会员权益信息添加成功")
            router.push("/ShowMember")
        }else{
            alert("会员权益信息添加失败")
        }
    })
}

</script>